<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title></title>
    <script src="./jquery-3.6.0.min.js"></script>
    <script type="text/javascript">
        $(function() {
            $("#table1 tr:odd").css("background-color", "red");
            $("#table1 tr:even").css("background-color", "blue");
        });
    </script>
</head>

<body>
    <table align="center" id="table1" border="1px" width="600px">
        <tr>
            <td>A1</td>
            <td>B1</td>
            <td>C1</td>
            <td>D1</td>
        </tr>
        <tr>
            <td>A2</td>
            <td>B2</td>
            <td>C2</td>
            <td>D2</td>
        </tr>
        <tr>
            <td>A3</td>
            <td>B3</td>
            <td>C3</td>
            <td>D3</td>
        </tr>
        <tr>
            <td>A4</td>
            <td>B4</td>
            <td>C4</td>
            <td>D4</td>
        </tr>
        <tr>
            <td>A5</td>
            <td>B5</td>
            <td>C5</td>
            <td>D5</td>
        </tr>
        <tr>
            <td>A6</td>
            <td>B6</td>
            <td>C6</td>
            <td>D6</td>
        </tr>
        <tr>
            <td>A7</td>
            <td>B7</td>
            <td>C7</td>
            <td>D7</td>
        </tr>
    </table>
</body>

</html>